<template>
    <div class="login-box">
        <div class="welcome" v-if="welcome">
            <!-- 倒计时进入登录或者直接跳转到首页 -->
            <van-circle v-model="currentTime"
                layer-color="#C1AB96"
                style="position: absolute; top: 10px; right: 10px;"
                size="56px"
                :rate="currentTime"
                v-on:click.native="closeWelcome"
                :text="`${time}s`"/>
            <i class="icon"></i>
            <span>{{log}}</span>
        </div>
        <div class="login" v-else>
            <h3 @click="loginEvt">去首页</h3>
            <h3 @click="registerEvt">去注册</h3>
        </div>
    </div>
</template> 

<script>

    // 单个接口引入

    export default {
        data(){
            return{
                // 是否关闭广告
                welcome:true,
                // 倒计时秒数
                time: 5,
                currentTime: 100,
            }
        },
        methods: {
            loginEvt(){
                this.$router.push('/home')
            },
            registerEvt(){
                this.$router.push('/Register')
            }
        }
    }
</script>

<style lang="less" scoped>
    @import "../../style/common.less";
    .login-box {
        display: block;
        position: relative;
        height: 100%;
        padding: 4vh 20px 0;
        .welcome {
            .icon {
                display: block;
                margin: 16vh auto 0;
                width: 180px;
                height: 80px;
                background: url(../../images/wel-icon.png) center center / 100% 100% no-repeat;
            }
            > span {
                display: block;
                padding: 30px 0;
                font-size: .8rem;
                color: @primary;
                text-align: center;
            }
        }
    }
</style>